import React from 'react';
import { IconButton } from '@mui/material';
import { Icon } from '@mui/material';

interface NetPyNEPlotThumbnailProps {
  name: string;
  selected?: boolean;
  handleClick: (name: string) => void;
  [key: string]: any;
}

const NetPyNEPlotThumbnail: React.FC<NetPyNEPlotThumbnailProps> = ({
  name,
  selected = false,
  handleClick,
  ...otherProps
}) => {
  const handleClickInternal = (): void => {
    handleClick(name);
  };

  return (
    <IconButton
      className={`gearThumbButton ${selected ? 'selectedGearButton' : ''}`}
      onClick={handleClickInternal}
      {...otherProps}
    >
      <Icon color="primary" className="gpt-fullgear" />
      <span className="gearThumbLabel">{name}</span>
    </IconButton>
  );
};

export default NetPyNEPlotThumbnail;

